/**
 * 英语单词学习应用 JavaScript 功能
 */

// 平台检测功能
function getPlatform() {
    const urlParams = new URLSearchParams(window.location.search);
    return urlParams.get('platform') || 'ios'; // 默认为iOS
}

// 主题检测功能
function getTheme() {
    const urlParams = new URLSearchParams(window.location.search);
    return urlParams.get('theme') || 'light'; // 默认为浅色模式
}

// 应用初始化
function initApp() {
    const platform = getPlatform();
    const theme = getTheme();
    const container = document.querySelector('.app-container');
    
    if (container) {
        // 添加平台类
        container.classList.add(platform);
        
        // 添加主题类
        if (theme === 'dark') {
            container.classList.add('dark');
        }
        
        // 初始化状态栏
        initStatusBar(platform, theme);
        
        // 初始化导航栏
        initNavBar(platform, theme);
        
        // 设置内容区域样式
        const content = document.querySelector('.app-content');
        if (content && platform === 'android') {
            content.classList.add('android');
        }
    }
}

// 初始化状态栏
function initStatusBar(platform, theme) {
    const statusBarEl = document.querySelector('.statusbar');
    if (statusBarEl) {
        // 清除现有类
        statusBarEl.className = 'statusbar';
        
        // 添加平台特定类
        statusBarEl.classList.add(platform === 'ios' ? 'ios-statusbar' : 'android-statusbar');
        
        // 添加主题类
        if (theme === 'dark') {
            statusBarEl.classList.add('dark');
        }
        
        // 设置状态栏内容
        const currentTime = new Date().toLocaleTimeString([], {hour: '2-digit', minute:'2-digit'});
        statusBarEl.innerHTML = `
            <div class="status-left">
                ${platform === 'ios' ? currentTime : ''}
            </div>
            <div class="status-center">
                ${platform === 'android' ? '' : ''}
            </div>
            <div class="status-right">
                <i class="fas fa-wifi"></i>
                <i class="fas fa-signal"></i>
                <i class="fas fa-battery-three-quarters"></i>
            </div>
        `;
    }
}

// 初始化导航栏
function initNavBar(platform, theme) {
    const navbarEl = document.querySelector('.navbar');
    if (navbarEl) {
        // 清除现有类
        navbarEl.className = 'navbar';
        
        // 添加平台特定类
        navbarEl.classList.add(platform === 'ios' ? 'ios-navbar' : 'android-navbar');
        
        // 添加主题类
        if (theme === 'dark') {
            navbarEl.classList.add('dark');
        }
        
        // 获取当前页面
        const currentPage = window.location.pathname.split('/').pop().split('.')[0];
        
        // 设置导航栏项目
        navbarEl.innerHTML = `
            <a href="home.html?platform=${platform}&theme=${theme}" class="navbar-item ${currentPage === 'home' ? 'active' : ''}">
                <i class="navbar-icon fas fa-home"></i>
                <span>首页</span>
            </a>
            <a href="wordbooks.html?platform=${platform}&theme=${theme}" class="navbar-item ${currentPage === 'wordbooks' ? 'active' : ''}">
                <i class="navbar-icon fas fa-book"></i>
                <span>词库</span>
            </a>
            <a href="learning.html?platform=${platform}&theme=${theme}" class="navbar-item ${currentPage === 'learning' ? 'active' : ''}">
                <i class="navbar-icon fas fa-graduation-cap"></i>
                <span>学习</span>
            </a>
            <a href="review.html?platform=${platform}&theme=${theme}" class="navbar-item ${currentPage === 'review' ? 'active' : ''}">
                <i class="navbar-icon fas fa-sync"></i>
                <span>复习</span>
            </a>
            <a href="profile.html?platform=${platform}&theme=${theme}" class="navbar-item ${currentPage === 'profile' ? 'active' : ''}">
                <i class="navbar-icon fas fa-user"></i>
                <span>我的</span>
            </a>
        `;
        
        // 添加正确的类名
        const navbarItems = navbarEl.querySelectorAll('.navbar-item');
        navbarItems.forEach(item => {
            item.classList.add(platform === 'ios' ? 'ios-navbar-item' : 'android-navbar-item');
            const icon = item.querySelector('.navbar-icon');
            if (icon) {
                icon.classList.add(platform === 'ios' ? 'ios-navbar-icon' : 'android-navbar-icon');
            }
        });
    }
}

// 示例单词数据
const sampleWords = [
    {
        id: 1,
        term: "serendipity",
        phonetic: "/ˌser.ənˈdɪp.ə.ti/",
        definition: "the fact of finding interesting or valuable things by chance",
        examples: ["They found each other by serendipity.", "The discovery of penicillin was a serendipity."],
        level: "高级",
        category: "日常生活"
    },
    {
        id: 2,
        term: "ephemeral",
        phonetic: "/ɪˈfem.ər.əl/",
        definition: "lasting for a very short time",
        examples: ["Fashion is ephemeral.", "The ephemeral nature of fame."],
        level: "高级",
        category: "艺术文学"
    },
    {
        id: 3,
        term: "ubiquitous",
        phonetic: "/juːˈbɪk.wɪ.təs/",
        definition: "seeming to be everywhere",
        examples: ["Mobile phones are now ubiquitous.", "These plants are ubiquitous in this region."],
        level: "高级",
        category: "科技"
    },
    {
        id: 4,
        term: "pragmatic",
        phonetic: "/præɡˈmæt.ɪk/",
        definition: "solving problems in a sensible way that suits the conditions rather than fixed ideas",
        examples: ["We need a pragmatic approach to this problem.", "She takes a pragmatic view of life."],
        level: "中级",
        category: "商业"
    },
    {
        id: 5,
        term: "resilience",
        phonetic: "/rɪˈzɪl.i.əns/",
        definition: "the ability to be happy, successful again after something difficult has happened",
        examples: ["The resilience of the human spirit.", "She showed remarkable resilience in recovering from her injuries."],
        level: "中级",
        category: "心理学"
    }
];

// 示例词库数据
const sampleWordbooks = [
    {
        id: 1,
        name: "雅思核心词汇",
        description: "雅思考试必备的3000个核心词汇",
        count: 3000,
        progress: 65,
        level: "进阶",
        category: "考试"
    },
    {
        id: 2,
        name: "商务英语词汇",
        description: "职场和商务环境中常用的英语词汇",
        count: 2500,
        progress: 42,
        level: "中级",
        category: "职场"
    },
    {
        id: 3,
        name: "旅行英语词汇",
        description: "旅行中实用的英语单词和短语",
        count: 1200,
        progress: 88,
        level: "初级",
        category: "旅行"
    },
    {
        id: 4,
        name: "四级必备词汇",
        description: "英语四级考试常考核心词汇",
        count: 2200,
        progress: 95,
        level: "基础",
        category: "考试"
    },
    {
        id: 5,
        name: "医学专业英语",
        description: "医学相关专业英语词汇",
        count: 3500,
        progress: 25,
        level: "高级",
        category: "专业"
    }
];

// 示例学习进度数据
const sampleProgressData = {
    totalWords: 12500,
    learnedWords: 4356,
    reviewedWords: 3102,
    masteredWords: 2854,
    dailyGoal: 50,
    dailyLearned: 32,
    streak: 15,
    weeklyData: [28, 35, 42, 30, 25, 32, 15],
    monthlyData: [320, 420, 380, 450]
};

// 导出数据供页面使用
window.appData = {
    words: sampleWords,
    wordbooks: sampleWordbooks,
    progress: sampleProgressData
};

// 页面加载时初始化
document.addEventListener('DOMContentLoaded', function() {
    initApp();
    
    // 为打开模式切换按钮添加事件监听
    const themeToggle = document.getElementById('theme-toggle');
    if (themeToggle) {
        themeToggle.addEventListener('click', function() {
            const currentTheme = getTheme();
            const newTheme = currentTheme === 'light' ? 'dark' : 'light';
            
            // 更新当前URL的主题参数
            const url = new URL(window.location.href);
            url.searchParams.set('theme', newTheme);
            window.location.href = url.toString();
        });
    }
    
    // 在DOM中查找和替换{{变量}}格式的数据绑定
    const bindData = function() {
        document.querySelectorAll('[data-bind]').forEach(el => {
            const bindProperty = el.getAttribute('data-bind');
            const bindParts = bindProperty.split('.');
            let value = window.appData;
            
            // 递归查找绑定的数据值
            for (const part of bindParts) {
                if (value && value.hasOwnProperty(part)) {
                    value = value[part];
                } else {
                    value = null;
                    break;
                }
            }
            
            // 应用绑定值
            if (value !== null && value !== undefined) {
                el.textContent = value;
            }
        });
    };
    
    // 执行数据绑定
    bindData();
}); 